<template>
  <view class="list-item-top" v-if="orderitem.mch && orderitem.mch.name">
    <view class="list-item-top-left">
      <text class="iconfont icon-store" style="font-size: 44rpx; font-weight:400;margin-right:12rpx;" ></text>
      <view>{{  orderitem.md_name }}</view>
    <!-- <text class="iconfont icon-arrow-right" style="font-size: 22rpx;font-weight:400;"></text> -->
    </view>
    <view class="list-item-top-right"  :style="{color: orderStatus.color}">
      <template>
        {{ orderStatus.str }}
      </template>
      <image v-if="orderitem.is_cancel == 1 || orderitem.is_confirm == 1" @click="deleteItem" src="" alt="" mode="aspectFit">
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
    orderitem: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  computed: {
    // 订单状态
    orderStatus() {
      //   订单状态，-1:默认，0:待发货，1:已取消，2:已发货，3:已确认
      let str = "", //订单注释
        color = "#F7271F;"; //按钮文本
      if (this.orderitem.trade_status == -1 && this.orderitem.pay_type != 2) {
        str = this.$t('order.wait');
      }
      // 待发货,  或者货到付款,且状态未支付
      if (
        this.orderitem.trade_status == 0 ||
        (this.orderitem.trade_status == -1 && this.orderitem.pay_type == 2)
      ) {
        str = this.$t('order.waitSend');
      }
      if (this.orderitem.trade_status == 1) {
        str = this.$t('shop.cancled');
        color = "#8c8c8c";
      }
      if (this.orderitem.trade_status == 2) {
        str = this.$t('order.waitTake');
      }
      if (this.orderitem.trade_status == 3) {
        str = this.$t('person.status4');
        color = "#8c8c8c";
      }

      let {order_type,trade_status} = this.orderitem
      if(order_type === 1){
        if(trade_status == 3){
          // 已使用
          str = '已完成'
        }else if([0,2].includes(trade_status)){
          // 待核销
          str = '待使用'
        }
      }

      return {
        color,
        str,
      };
    },
  },
  methods: {
    deleteItem() {
      uni.showModal({
        title: this.$t('order.prompt'),
        content: this.$t('order.confirmDel'),
        success: function (res) {
          if (res.confirm) {
          } else if (res.cancel) {
          }
        },
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.list-item-top {
  display: flex;
  justify-content: space-between;
  align-items: center;

  .list-item-top-left {
    display: flex;
    align-items: center;
    font-weight: 600;
    view {
      font-size: 28rpx;
      color: #262626;
      line-height: 44rpx;
    }

    image:first-child {
      width: 28rpx;
      height: 28rpx;
    }

    image:last-child {
      width: 12rpx;
      height: 20rpx;
    }
  }

  .list-item-top-right {
    font-size: 26rpx;
    color: #f23030;

    image {
      width: 28rpx;
      height: 28rpx;
      margin-left: 30rpx;
    }
  }
}
</style>
